﻿<!DOCTYPE html>
<html lang="zh">
<head>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta name="renderer" content="webkit">
    <meta http-equiv="CurrData.Type" content="text/html; charset=utf-8" />
    <meta charset="utf-8" />
    <title>Index </title>
    <link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />

    <link href="/js/kd/styles/kendo.common.min.css" rel="stylesheet" />
    <link href="/js/kd/styles/kendo.blueopal.min.css" rel="stylesheet" />
    <link href="/js/fa/css/font-awesome.min.css" rel="stylesheet" />
    <link href="/js/site.css?t=20221031" rel="stylesheet" />

    <script src="/js/kd/jquery.min.js"></script>
    <script src="/js/kd/kendo.web.min.js"></script>

    <script src="/js/kd/cultures/kendo.culture.zh-CN.min.js"></script>
    <script src="/js/kd/messages/kendo.messages.zh-CN.min.js"></script>
    <script src="/js/kd/jszip.min.js"></script>


    <script src="/js/kendo_stdefine.js"></script>
    <script src="/js/site50.js"></script>
    <script src="/js/xlsx.full.min.js?t=1"></script>

</head>
<body>
    <style>
       
    </style>
    <div id="divSplitter" data-role="splitter"
         data-panes="[
                { collapsible: false, resizable: false },
                { collapsible: false, resizable: false,  size: '50px' }
             ]"
         data-orientation="vertical"
         >

        <div id="center" style="overflow:hidden;padding-top:0px;overflow-y: auto;">

            <form id="form1">
                <div style="height:10px;"></div>
                <div class="flexrow">
                    <div class="tdLabel75 Required">数据名称</div>
                    <div class="tdValue">
                        <input id="Name" name="数据名称" style="width:150px;"
                               required
                               class="k-textbox"
                               data-bind="value:m.Name" />
                    </div>
                    <div style="width:20px;"></div>
                </div>
                <div class="flexrow">
                    <div class="tdLabel75  Required">功能码</div>
                    <div class="tdValue">

                        <input id="Gnm" name="功能码"
                               required
                               style="width:150px;"
                               data-role="numerictextbox"
                               data-min="0"
                               data-max="255"
                               data-format="N0"
                               data-bind="value:m.Gnm" />

                    </div>
                    <div style="width:20px;"></div>
                </div>
                <div class="flexrow">
                    <div class="tdLabel75  Required">开始地址</div>
                    <div class="tdValue">

                        <input id="StartAddress" style="width:150px;"
                               name="开始地址"
                               required
                               data-role="numerictextbox"
                               data-min="0"
                               data-max="65555"
                               data-format="N0"
                               data-bind="value:m.StartAddress" />


                    </div>
                    <div style="width:20px;"></div>
                </div>

                <div class="flexrow">
                    <div class="tdLabel75  Required">数据数量</div>
                    <div class="tdValue">
                        <input id="ReqNum"
                               name="数据数量"
                               required
                               style="width:150px;"
                               data-role="numerictextbox"
                               data-min="0"
                               data-max="20"
                               data-format="N0"
                               data-bind="value:m.ReqNum,events:{change:CreateData}" />
                    </div>
                    <div style="width:20px;"></div>
                </div>


                <div class="flexrow">
                    <div class="tdLabel75   "></div>
                    <div class="tdValue" style="width:120px;">
                        <input type="checkbox" name="BitData" id="BitData" class="k-checkbox"
                               data-bind="checked:m.BitData,events:{change:CreateData}">
                        <label class="k-checkbox-label" for="BitData">是否按Bit接收</label>

                    </div>

                    <div class="tdValue">

                    </div>
                    <div style="width:20px;"></div>
                </div>


                <div class="flexrow">
                    <div class="tdLabel75   "></div>
                    <div class="tdValue" style="width:120px;flex:none;">
                        <input type="checkbox" name="LoopStatus" id="LoopStatus" class="k-checkbox"
                               data-bind="checked:m.LoopStatus,events:{change:LoopStatus_Change}">

                        <label class="k-checkbox-label" for="LoopStatus">是否循环</label>

                    </div>
                    <div class="tdLabel75" style="width:100px;">
                        循环间隔
                    </div>
                    <div class="tdValue" style="width: 150px; flex: none;">
                        <input id="LoopSencond" style="width:150px;"
                               data-role="numerictextbox"
                               data-min="0"
                               data-max="600000"
                               data-format="N0"
                               data-bind="value:m.LoopSencond" />

                    </div>
                    <div class="tdValue" style="width: 30px; flex: none;">
                        秒
                    </div>
                    <div class="tdValue">
                    </div>
                    <div style="width:20px;"></div>
                </div>

             

                <div class="flexrow">
                    <div class="tdLabel75 Required">请求设备号从</div>
                    <div class="tdValue" style="width: 150px;flex:none;">
                        <input id="LoopBeginFml" name="请求数从" style="width: 150px;"
                               required
                               class="k-textbox"
                               data-bind="value:m.LoopBeginFml" />
                    </div>
                    <div class="tdLabel75  " style="">到</div>
                    <div class="tdValue" style="width: 120px;flex:none;">
                        <input id="LoopEndFml" name="到" style="width:150px;"
                               required
                               class="k-textbox"
                               data-bind="value:m.LoopEndFml" />
                    </div>
                    <div class="tdLabel75 " style="width: 120px;flex: none; ">
                        每次设备个数

                    </div>
                    <div class="tdValueRequired" style="width: 120px; flex: none;">
                        <input id="LoopReqNum" style="width: 120px;"
                               data-role="numerictextbox"
                               data-min="0"
                               data-max="600000"
                               data-format="N0"
                               data-bind="value:m.LoopReqNum" />

                    </div>
                    <div class="tdValue">
                    </div>
                    <div style="width:20px;"></div>


                </div>


                <div class="flexrow">
                    <div class="tdLabel75 Required">设备编号公式</div>
                    <div class="tdValue">
                        <input id="DeviceCodeFml" name="设备编号公式" style="width:150px;"
                               required
                               class="k-textbox"
                               data-bind="value:m.DeviceCodeFml" />
                    </div>
                    <div style="width:20px;"></div>
                </div>
            </form>

            <div style="height:10px;"></div>
            <div id="grid" style="height: calc(100% - 280px)"></div>

        </div>

        <div id="bottom" class="flexrow" style="  ">

            <div style="flex:1;">


            </div>
            <div style="width:100px;" >
                <a href="javascript:btnOKonClick();" class="k-button" style="width:80px; " accesskey="S">
                    
                    <i class="fa fa-save"></i>
                    <span style="text-decoration:underline;margin-left:5px;">S</span>
                    确定
                </a>
            </div>
            <div style="width:80px;">
                <a href="javascript:myWindowClose();" class="k-button" style="width: 80px;  " accesskey="C">
                    <i class="fa fa-close"></i>
                    <span style="text-decoration: underline; margin-left: 5px;">C</span>
                    取消

                </a>
            </div>
            <div style="width:20px;"></div>
           
        </div>

    </div>



        <script>
            var IsAdd = false;
            var grid = null;
            var viewModel = new kendo.data.ObservableObject({
                CreateData: function () {
                    CreateData();
                },
                LoopStatus_Change: function () {
                    var b = viewModel.m.LoopStatus;
                  
                   $("#LoopSencond").data("kendoNumericTextBox").enable(b);
                },
                m: {
                   
                }, 
                PropType: [
                    { Name: "状态" },
                    { Name: "值" },
                    { Name: "类型" },
                    { Name: "单位" },
                    { Name: "精度" },
                    { Name: "上限" },
                    { Name: "下限" },
                    { Name: "预留" },
                ],
                DataType: [
                    { Name: "Bit", Len: 1 },
                    { Name: "Byte", Len: 1 },
                    { Name: "UInt16", Len: 2 },
                    { Name: "Int", Len: 4 },
                    { Name: "Float", Len: 4 }
                ],
                SJZD: [],

            });
            function DataTypeEditor(container, options) {
                $('<input   name="DataType">')
                    .appendTo(container)
                    .kendoDropDownList({
                        autoBind: false,
                        dataTextField: "Name",
                        dataValueField: "Name",
                        dataSource: {
                            data: viewModel.DataType
                        }
                    });
            }
            function PropTypeEditor(container, options) {
                $('<input   name="PropType">')
                    .appendTo(container)
                    .kendoDropDownList({
                        autoBind: false,
                        dataTextField: "Name",
                        dataValueField: "Name",
                        dataSource: {
                            data: viewModel.PropType
                        }
                    });
            }
            function SJZDKeyEditor(container, options) {
                $('<input   name="SJZDKey">')
                    .appendTo(container)
                    .kendoDropDownList({
                        autoBind: false,
                        dataTextField: "Name",
                        dataValueField: "Name",
                        dataSource: {
                            data: viewModel.SJZD
                        }
                    });
            }
            function FmlEditor(container, options) {
                $('<input   name="Fml" class="k-textbox" placeholder="值/100">')
                    .appendTo(container)
                ;
            }

            function CreateData() {
                
                var BitData = viewModel.m.BitData;
                var ReqNum = viewModel.m.ReqNum;
                var data = [];
                for (var i = 1; i <= ReqNum; i++) {

                    data.push({
                        Id: i, 
                        PropCode: `1`,
                        PropName: `数据${i  }`,
                        DataType: BitData ? "Bit" : "UInt16",
                        DataLen: 1,
                        PropType: "状态",
                        SJZDKey:"",
                    });
 

                }
                for (var j = 0; j < viewModel.m.Data.length && j < data.length; j++) {
                    data[j].PropCode = viewModel.m.Data[j].PropCode;
                    data[j].PropName = viewModel.m.Data[j].PropName;
                    data[j].DataType = viewModel.m.Data[j].DataType;
                    data[j].DataLen = viewModel.m.Data[j].DataLen;
                    data[j].PropType = viewModel.m.Data[j].PropType;
                    data[j].SJZDKey = viewModel.m.Data[j].SJZDKey; 
                    data[j].Fml = viewModel.m.Data[j].Fml;
                    
                }

                 grid =$("#grid").data("kendoGrid");

                var dsoptions = {
                    schema: {
                        model: {
                            id: "Id",
                            fields: { Id: { editable: false, nullable: true } }
                        }
                    },
                    data: data,
                };
                var gridDataSource = new kendo.data.DataSource(dsoptions);
                grid.setDataSource(gridDataSource);
                gridDataSource.read();

            }

            function Init() {
                $("#form1").kendoValidator()

                kendo.bind($("#divSplitter"), viewModel); 


                var opt = Object.assign({}, gridBaseOption);
                opt.editable = true;
                opt.columns = [
                    {
                        title: '编号', field: "Id", width: 50, sortable: false, filterable: false,
                        editable: function (dataItem) { return false }
                    },
                    {
                        title: '属性编号', field: "PropCode", width: 100, sortable: false, filterable: false,
                        editable: () => { return true; }

                    },
                    {
                        title: '属性名称', field: "PropName", width: 100, sortable: false, filterable: false,
                        editable: () => { return true; }

                    },
                    {
                        title: '数据格式', field: "DataType", width: 100, sortable: false, filterable: false,
                        editable: (row) => {
                            return row.DataType != "Bit";
                        },
                        editor: DataTypeEditor,

                    },


                    {
                        title: '对应类型', field: "PropType", width: 100, sortable: false, filterable: false,

                        editor: PropTypeEditor
                    }
                    ,
                    {
                        title: '数据字典', field: "SJZDKey", width: 100, sortable: false, filterable: false,
                        editable: function (dataItem) { return dataItem.PropType == "状态" || dataItem.PropType == "类型" || dataItem.PropType == "单位" },
                        editor: SJZDKeyEditor
                        
                    }
                    ,
                    {
                        title: '计算公式', field: "Fml", width: 100, sortable: false, filterable: false,
                        editable: function (dataItem) { return dataItem.PropType == "值"},
                        editor: FmlEditor

                    }

                ]
                grid = $("#grid").kendoGrid(opt).data("kendoGrid");

            }
            function FindDataType(name) {
                for (var i = 0; i < viewModel.DataType.length; i++) {
                    if (viewModel.DataType[i].Name == name) {
                        return viewModel.DataType[i];
                    }
                }
                return null;
            }
            function btnOKonClick() {

                var v = $("#form1").data("kendoValidator");
                if (v.validate() == false) return;

                var ds = grid.dataSource;
                var data = ds.data();
                var data2 = [];
                for (var i = 0; i < data.length; i++) {
                    var o = data[i];
                    if (!o.PropCode) {
                        myAlert(`第${i+1}行 属性编号不能为空`);
                        return;
                    }
                    
                    if (!o.PropType) {
                        myAlert(`第${i + 1}行 必须选择属性格式`);
                        return;
                    }

                    var mdt = FindDataType(data[i].DataType);
                    if (mdt != null) {
                        data[i].Len = mdt.Len;
                    }

                    if (o.PropType == "状态" || o.PropType == "类型" || o.PropType == "单位") {
                        if (!o.SJZDKey) {
                            myAlert(`第${i + 1}行 必须选择数据字典`);
                            return;
                        }
                    }


                    data2.push(data[i]);


                }

                data = data2;


                var m = viewModel.m.toJSON();
                m.Data = data; 

                onOk(m );
            }
            function setData(data) {
 
                viewModel.set("m", data.m);
                viewModel.set("SJZD", data.SJZD);
                CreateData();
                viewModel.LoopStatus_Change();
            }

        </script>
        <script>
            var SizeInfo;
            $(function () {

                kendo.culture("zh-CN");


                if (window.Init) {
                    Init();
                }
            });
            function After50(d) {
                if (d) {
                    setTimeout(function () { d(); }, 50);
                }
            }
        </script>
</body>
</html>
